<!DOCTYPE html>
<html class="iframe-h">

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" type="text/css" href="./static/admin/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="./static/admin/css/admin.css"/>
                
    <script type="text/javascript" src="./static/js/jquery-1.12.4.js"></script>
    <script type="text/javascript" src="./static/js/my.js"></script>
</head>

<body>
<div class="wrap-container clearfix">
    <div class="column-content-detail">
        <form class="layui-form" action="">
            <div class="layui-form-item">
                <div class="layui-inline tool-btn">
                    <button class="layui-btn layui-btn-small layui-btn-normal addBtn" data-url="site-add.html"><i
                            class="layui-icon">&#xe654;</i></button>
                    <button class="layui-btn layui-btn-small layui-btn-danger delBtn" data-url="article-add.html"><i
                            class="layui-icon">&#xe640;</i></button>
                    <button class="layui-btn layui-btn-small layui-btn-warm listOrderBtn hidden-xs"
                            data-url="article-add.html"><i class="iconfont">&#xe656;</i></button>
                </div>
                <div class="layui-inline">
                    <input type="text" name="title" required lay-verify="required" placeholder="请输入标题"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-inline">
                    <select name="states" lay-filter="status">
                        <option value="">请选择一个状态</option>
                        <option value="010">正常</option>
                        <option value="021">停止</option>
                        <option value="0571">删除</option>
                    </select>
                </div>
                <button class="layui-btn layui-btn-normal" lay-submit="search">搜索</button>
            </div>
        </form>
        <div class="layui-form" id="table-list">
            <table class="layui-table" lay-even lay-skin="nob">
                <colgroup>
                    <col width="50">
                    <col class="hidden-xs" width="350">
                    <col class="hidden-xs" width="250">
                    <col class="hidden-xs" width="250">
                    <col class="hidden-xs" width="250">
                    <col width="180">
                </colgroup>
                <thead>
                <tr>
                    <th><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"></th>
                    <th class="hidden-xs">ID</th>
                    <th class="hidden-xs">监控名</th>
                    <th>URL</th>
                    <th class="hidden-xs">修改时间</th>
                    <th>间隔</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <!--<td><input type="checkbox" name="" lay-skin="primary" data-id="1"></td>-->
                    <!--<td>ID</td>-->
                    <!--<td>监控名</td>-->
                    <!--<td>URL</td>-->
                    <!--<td>修改时间</td>-->
                    <!--<td>启用/禁用</td>-->
                    <!--<td>-->
                        <!--<div class="layui-inline">-->
                            <!--<button class="layui-btn layui-btn-small layui-btn-normal go-btn" data-id="1"-->
                                    <!--data-url="article-detail.html"><i class="layui-icon">&#xe642;</i></button>-->
                            <!--<button class="layui-btn layui-btn-small layui-btn-danger del-btn" data-id="1"-->
                                    <!--data-url="article-detail.html"><i class="layui-icon">&#xe640;</i></button>-->
                        <!--</div>-->
                    <!--</td>-->
                </tr>
                </tbody>
            </table>
            <div class="page-wrap">
                <ul class="pagination">
                    <li class="disabled"><span>«</span></li>
                    <li class="active"><span>1</span></li>
                    <li>
                        <a href="#">»</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<script src="./static/admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
<script src="./static/admin/js/common.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="./static/js/jquery-1.12.4.js"></script>

<script>
    site_list();

    function timestampToTime(timestamp) {
        var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
        Y = date.getFullYear() + '-';
        M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        D = date.getDate() + ' ';
        h = date.getHours() + ':';
        m = date.getMinutes() + ':';
        s = date.getSeconds();
        return Y + M + D + h + m + s;
    }

    function site_list() {
        //站点列表信息
        $.ajax({
            "url": "/api/website",
            "type": "get",
            "dataType": 'json',
            xhrFields: {
                withCredentials: true
            },
            error: function () {
                alert("站点信息获取失败！");
            },
            success: function (data) {
                // alert(data.data);
                //站点列表html
                var site_html = '';
                var d = data.data;
                for (var i in d) {
                    // alert(d[i]['ts']);
                    // var ts = timestampToTime(d[i]['ts']);
                    var ts = d[i]['ts'];
                    var name = d[i]['name'];
                    var url = d[i]['url'];
                    var url_id = d[i]['url_id'];
                    var interval = d[i]['interval'];
                    var is_enable = d[i]['is_enable'];
                    if (is_enable == 1) {
                        is_enable = "启用"
                    } else {
                        is_enable = "未启用"
                    }
                    site_html = site_html + '<tr><td><input type="checkbox" name="" lay-skin="primary" data-id="1"></td><td >' + url_id + '</td><td>' + name + '</td><td>' + url + '</td><td>' + ts + '</td><td>' + interval + '分钟</td><td>' + is_enable + '</td><td><div class="layui-inline"><button class="layui-btn layui-btn-small layui-btn-normal go-btn" data-id="' + url_id + '" data-url="site-edit.html"><i class="layui-icon">&#xe642;</i></button><button class="layui-btn layui-btn-small layui-btn-danger del-btn" data-id="' + url_id + '"><i class="layui-icon">&#xe640;</i></button></div></td></tr>'

                    // if(i == 0){
                    // 	site_html = site_html + '<tr><td><input type="checkbox" name="" lay-skin="primary" data-id="1"></td><td >ID</td><td>监控名</td><td>URL</td><td>修改时间</td><td>启用/禁用</td><td><div class="layui-inline"><button class="layui-btn layui-btn-small layui-btn-normal go-btn" data-id="1" data-url="article-detail.html"><i class="layui-icon">&#xe642;</i></button><button class="layui-btn layui-btn-small layui-btn-danger del-btn" data-id="1" data-url="article-detail.html"><i class="layui-icon">&#xe640;</i></button></div></td></tr>'
                    // }
                    // else {
                    // 	var hostid = data[i]['hostids']
                    // 	site_html = site_html + '<tr><td>' + time + '</td><td>' + hostname + '</td><td>' + message + '</td><td>' + priority + '</td></tr>'
                    // }
                }
                $('tbody').empty().append(site_html)
                // $('#alert-option').empty().append(chart_body)
                // $('#alert-option').css('display', 'inline-block')
                // $("select option").each(function() {
                // 	var text = $(this).text();
                // 	if($("select option:contains("+text+")").length > 1)
                // 		$("select option:contains("+text+"):gt(0)").remove();
                // });
                // host_change()
            }
        })
    }
</script>
<script>
    layui.use(['form', 'jquery', 'laydate', 'layer', 'laypage', 'dialog',   'element'], function() {
        var form = layui.form(),
            layer = layui.layer,
            $ = layui.jquery,
            dialog = layui.dialog;
        //列表删除
        $('#table-list').on('click', '.del-btn', function () {
            var url = $(this).attr('data-url');
            var id = $(this).attr('data-id');
            dialog.confirm({
                message: '您确定要进行删除吗? 删除后对应的历史记录也会清除掉',
                success: function () {
                    delte_url(id)

                },
                cancel: function () {
                    layer.msg('取消了')
                }
            });
            return false;
        });
    });

    function delte_url(url_id) {
        var dataj = {"url_id":url_id};
        //站点列表信息
        $.ajax({
            "url": "/api/website",
            "type": "delete",
            "dataType": 'json',
            data:JSON.stringify(dataj),
            xhrFields: {
                withCredentials: true
            },
            error: function () {
                alert("站点信息获取失败！");
            },
            success: function (data) {
                alert("删除成功");
                location.reload();
            }
        })
    }

</script>
</body>

</html>